/*
* Created by: yyf
* Description: 母基金管理--投资中母基金 投资数据
*/
<template>
    <div class="ca-box-border-top-none ca-p-22">
        <el-row class="ca-title">
            <h3>拟投资子基金</h3>
        </el-row>
        <el-table :data="investmentData" class="ca-table ca-m-t-10">
            <el-table-column label="基金名称" show-overflow-tooltip>
                <template slot-scope="scope">
                    <el-button type="text" @click="toEstablish(scope.row.id)" :disabled="scope.row.existence">{{scope.row.fundName}}</el-button>
                </template>
            </el-table-column>
            <el-table-column label="基金类型">
                <template slot-scope="scope">
                    {{scope.row.fundType | getNameById('fundType')}}
                </template>
            </el-table-column>
            <el-table-column label="拟设立规模</br>(万元)"
                             prop="fundScale"
                             :render-header="renderTitle"
                             show-overflow-tooltip>
                <template slot-scope="scope">
                    {{scope.row.fundScale | format1}}
                </template>
            </el-table-column>
            <el-table-column label="存续期" prop="duration" show-overflow-tooltip></el-table-column>
            <el-table-column label="注册地区" prop="regionList" show-overflow-tooltip>
                <template slot-scope="scope">
                    {{scope.row.regionList | getRegionName(scope.row.regionList)}}
                </template>
            </el-table-column>
            <el-table-column label="投资地域" prop="region" show-overflow-tooltip></el-table-column>
            <el-table-column label="投资方向" prop="investmentDirection" show-overflow-tooltip></el-table-column>
        </el-table>
        <el-row class="ca-title ca-m-t-20">
            <h3>已投资子基金</h3>
        </el-row>
        <el-table :data="estInvestmentData" class="ca-table ca-m-t-10" show-summary :summary-method="getSummaries">
            <el-table-column label="基金简称" prop="fundName" show-overflow-tooltip>
                <template slot-scope="scope">
                    <el-button type="text" @click="toInvestment(scope.row.id)" :disabled="scope.row.existence">{{scope.row.fundName}}</el-button>
                </template>
            </el-table-column>
            <el-table-column label="管理机构" prop="mechanism" show-overflow-tooltip></el-table-column>
            <el-table-column label="初始认缴时间" prop="firstTime" show-overflow-tooltip></el-table-column>
            <el-table-column label="认缴金额</br>(万元)"
                             prop="subscribed"
                             :render-header="renderTitle"
                             show-overflow-tooltip>
                <template slot-scope="scope">
                    {{scope.row.subscribed | format1}}
                </template>
            </el-table-column>
            <el-table-column label="实缴金额</br>(万元)" prop="paid" :render-header="renderTitle" show-overflow-tooltip>
                <template slot-scope="scope">
                    {{scope.row.paid | format1}}
                </template>
            </el-table-column>
            <el-table-column label="权益占比" prop="proportion" show-overflow-tooltip></el-table-column>
            <el-table-column label="已投项目金额</br>(万元)"
                             prop="amountInvested"
                             width="100px"
                             :render-header="renderTitle"
                             show-overflow-tooltip>
                <template slot-scope="scope">
                    {{scope.row.amountInvested | format1}}
                </template>
            </el-table-column>
            <el-table-column label="已投项目个数" prop="motherFundInvestedItem" show-overflow-tooltip>
                <template slot-scope="scope">
                    <el-button type="text" @click="showInvestmentDialog(1, scope.row.motherFundInvestedItem, scope.row.fundName)">{{scope.row.motherFundInvestedItem.length}}</el-button>
                </template>
            </el-table-column>
            <el-table-column label="退出的项目金额</br>(万元)"
                             prop="amountExit" width="110px"
                             :render-header="renderTitle"
                             show-overflow-tooltip>
                <template slot-scope="scope">
                    {{scope.row.amountExit | format1}}
                </template>
            </el-table-column>
            <el-table-column label="退出项目个数" prop="motherFundExitItem" show-overflow-tooltip>
                <template slot-scope="scope">
                    <el-button type="text" @click="showInvestmentDialog(0, scope.row.motherFundExitItem, scope.row.fundName)">{{scope.row.motherFundExitItem.length}}</el-button>
                </template>
            </el-table-column>
            <el-table-column label="基金状态" prop="fundState">
                <template slot-scope="scope">
                    {{scope.row.fundState | getNameById('fundCostState')}}
                </template>
            </el-table-column>
        </el-table>
        <el-dialog :visible.sync="investmentDialog" :title="dialogTitle" :close-on-click-modal="false">
            <el-table :data="motherFundItemData" class="el-table">
                <el-table-column label="项目名称" prop="itemName" show-overflow-tooltip></el-table-column>
                <el-table-column label="注册地区" prop="region" show-overflow-tooltip>
                    <template slot-scope="scope">
                        {{scope.row.region | getRegionName('scope.row.region')}}
                    </template>
                </el-table-column>
                <el-table-column label="行业" prop="industry">
                    <template slot-scope="scope">
                        {{scope.row.industry | getNameById('industry')}}
                    </template>
                </el-table-column>
                <el-table-column label="初始投资日期" prop="firstInvestment" width="100px"></el-table-column>
                <el-table-column label="累计投资金额</br>(万元)"
                                 :render-header="renderTitle"
                                 prop="cumulativeMoney"
                                 width="100px"
                                 show-overflow-tooltip>
                    <template slot-scope="scope">
                        {{scope.row.cumulativeMoney | format1}}
                    </template>
                </el-table-column>
                <el-table-column label="占子基金规模的百分比" prop="percentage" show-overflow-tooltip></el-table-column>
                <el-table-column label="项目估值" prop="valuation" show-overflow-tooltip>
                    <template slot-scope="scope">
                        {{scope.row.valuation | format1}}
                    </template>
                </el-table-column>
                <el-table-column label="投资状态">
                    <template slot-scope="scope">
                        <span>{{itemState}}</span>
                    </template>
                </el-table-column>
            </el-table>
        </el-dialog>
    </div>
</template>

<script type="text/ecmascript-6">
        import {api} from '../api';
        import {STATUS_HTTP_SUCCESS, apiHttp} from '__service/csHttp';
    //    import {isNoAuth} from '__service/utils';
    export default {
        data() {
            return {
                itemId: this.$route.params.itemId,
                investmentData: [], // 投资数据 -- 拟投资子基金
                estInvestmentData: [], // 投资数据 -- 已投资子基金
                investmentDialog: false, // 是否显示已投资子基金 项目所投明细
                motherFundItemData: [], // 弹出框数据
                dialogTitle: '', // 弹出框标题
                itemState: '212', // 投资状态
            }
        },
        props: {
        },
        created() {
            this.getInvestmentList();
            this.getEstInvestmentList();
        },
        methods: {
            // 母基金-->投资数据--拟投资子基金-->列表
            async getInvestmentList() {
                let {resCode, data} = await apiHttp(api.GET_FUND_MOTHER_LIST, {fundId: this.itemId});
                if (resCode === STATUS_HTTP_SUCCESS) {
                    this.investmentData = data;
                }
            },
            // 母基金-->投资数据--已投资子基金-->列表
            async getEstInvestmentList() {
                let {resCode, data} = await apiHttp(api.GET_FUND_MOTHER_EST_LIST, {fundId: this.itemId});
                if (resCode === STATUS_HTTP_SUCCESS) {
                    this.estInvestmentData = data;
                }
            },
            // 从 拟投资 跳转
            toEstablish(id) {
                this.$router.push({name: 'pre-investment-funds', params: {itemId: id, tabIndex: '0', openWindow: true}})
            },
            // 从 已投资 跳转
            toInvestment(id) {
                this.$router.push({name: 'invested-fund', params: {fundId: id, tabIndex: '0', openWindow: true}})
            },
            // 显示已投资子基金 项目所投明细
            showInvestmentDialog(state, value, fundName) {
                this.motherFundItemData = value;
                if (state === 1) {
                    this.itemState = '投资中'
                    this.dialogTitle = '已投项目' + '(' + fundName + ')';
                } else if (state === 0) {
                    this.itemState = '已退出'
                    this.dialogTitle = '已退出项目' + '(' + fundName + ')';
                }
                this.investmentDialog = true;
            },
            // 已投资子基金 总计
            getSummaries(param) {
                const sums = [];
                const { columns, data} = param;
                columns.map((column, index) => {
                    const values = data.map(item => Number(item[column.property]));
                    if (index === 1 || index === 2 || index === 5 || index === 10) {
                        sums[index] = '-';
                    } else {
                        sums[index] = values.reduce((prev, curr) => {
                            const value = Number(curr);
                            if (!isNaN(value)) {
                                return prev + curr;
                            } else {
                                return prev;
                            }
                        }, 0);
                    }
                });
                sums[0] = '总计';
                return sums;
            },
        },
        components: {
        },
    }
</script>
<style rel="stylesheet/scss" lang="scss" scoped>
</style>
